import React from 'react';
import type { FormProps } from 'antd';
import { Button, Checkbox, Form, Input } from 'antd';
import {getToken,getUserInfo,getMenu} from "@/api/login"
import {useNavigate,HashRouter as Router,NavLink,RouterProvider,Outlet} from 'react-router-dom';

import cookie from 'js-cookie';
import "./login.less"
type FieldType = {
  username?: string;
  password?: string;
  remember?: string;
};





const login:React.FC = () => {
    const navigate = useNavigate();
    const onFinish: FormProps<FieldType>['onFinish'] = (values) => {
      console.log('Success:', values);
      getToken({username:values.username,password:values.password}).then((res:any)=>{
        cookie.set('token',res.token);
        getUserInfo().then((res:any)=>{
          sessionStorage.setItem('user',JSON.stringify(res.data));
          getMenu().then((res:any)=>{
            sessionStorage.setItem('menu',JSON.stringify(res.data));
          })
        })
        navigate('/')
      })
      
    };
    const onFinishFailed: FormProps<FieldType>['onFinishFailed'] = (errorInfo) => {
      console.log('Failed:', errorInfo);
      
    };
    return (
        <>
        <div className="login-container">
          <div className='login-box'>
            <h3 className='login-title'>Ghost Admin</h3>
            <Form
                name="basic"
                labelCol={{ span: 8 }}
                wrapperCol={{ span: 16 }}
                style={{ maxWidth: 600 }}
                initialValues={{ remember: true }}
                onFinish={onFinish}
                onFinishFailed={onFinishFailed}
                autoComplete="off"
            >
                <Form.Item<FieldType>
                label="用户名"
                name="username"
                rules={[{ required: true, message: 'Please input your username!' }]}
                >
                <Input />
                </Form.Item>

                <Form.Item<FieldType>
                label="密码"
                name="password"
                rules={[{ required: true, message: 'Please input your password!' }]}
                >
                <Input.Password />
                </Form.Item>

                <Form.Item<FieldType> name="remember" valuePropName="checked" label={null}>
                <Checkbox>记住我</Checkbox>
                </Form.Item>

                <Form.Item label={null}>
                <Button type="primary" htmlType="submit">
                    提交
                </Button>
                </Form.Item>
            </Form>
          </div>
        </div>
        
       
        </>
    )
}
  
export default login